﻿@model AexoManager.Models.DespieceViewModel
@{
    ViewBag.Title = "DespieceParte";
    Layout = "~/Views/Shared/_Template.cshtml";
}


@section ClientScripts {
    <link rel='stylesheet' type='text/css' href='~/Content/assets/plugins/form-nestable/jquery.nestable.css' />
    <script type='text/javascript' src='~/Content/assets/plugins/form-nestable/jquery.nestable.min.js'></script>

    <script type='text/javascript'>
        $(document).ready(function () {

            $('#despiece').nestable({
                group: 1
            });

            $("#Descripcion").typeahead({
                source: function (query, process) {
                    var partes = [];
                    map = {};
                    if (query.length > 3) {
                        // This is going to make an HTTP post request to the controller
                        return $.post('/Despiece/JsonConsultarParte', { query: query }, function (data) {
                            // Loop through and push to the array
                            $.each(data, function (i, parte) {
                                map[parte.Descripcion] = parte;
                                partes.push(parte.Descripcion);
                            });
                            // Process the details
                            process(partes);

                        });
                    }
                },
                updater: function (item) {
                    var selectedShortCode = map[item].IdParte;

                    // Set the text to our selected id
                    $("#IdParte").val(selectedShortCode);
                    return item;
                }
            });
            $("#btnAgregar").click(function () {
                $("#formPrincipal").attr("action", "@Url.Content("~/")Despiece/AgregarHijo");
                $("#formPrincipal").submit();
            });

            $("#btnInsumo").click(function () {
                $.ajax({
                    url: "AjaxBuscaParteInsumo",
                    type: "POST",
                    data: { IdPartePadre: $("#IdPartePadre").val() },
                    success: function (response, textStatus, jqXHR) {
                        if (response.IsExisting) {
                            // Si existe la pieza en la tabla insumo aviso que ya existe esta Parte como Insumo
                            //$("#regTitle").html("Already Exists")
                            alert("La parte ya existe como insumo");
                        }
                        else {
                            // User name is not existing
                            $('#myModal').modal('show');
                        }
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        alert("error");
                    },
                    // callback handler that will be called on completion
                    // which means, either on success or error
                    complete: function () {
                    }
                });
                //$('#myModal').modal('show');
            });

            $("#btnGuardarDespiece").click(function () {
                $("#formPrincipal").attr("action", "@Url.Content("~/")Despiece/GuardarDespieceParte");
                $("#formPrincipal").submit();
            });

            /*$.getJSON("/Despiece/ArmarArbolDespiece", function (data) {
                $.each(data, function (index, item) {

                    $('#despiece ul').append(buildItem(item));

                });
            });
            */
        });
        function detalleDespiece(idParte, idProducto) {
            $("#IdProducto").val(idProducto);
            $("#IdPartePadre").val(idParte);
            //alert("hola");
            $("#formPrincipal").attr("action", "@Url.Content("~/")Despiece/Parte");
            $("#formPrincipal").submit();
        }
        /*
        function buildItem(item) {

            var html = "<li class='dd-item' data-id='" + item.IdParte + "' id='" + item.IdParte + "'>";
            html += "<div class='dd3-content'><a href='javascript:detalleDespiece(" + item.Parte.IdParte + "," + +item.Producto.IdProducto + ");'>" + item.Parte.Descripcion + " / Cantidad: " + item.Cantidad + "</a></div>";

            if (item.Child) {

                html += "<ol class='dd-list'>";
                $.each(item.Child, function (index, sub) {
                    html += buildItem(sub);
                });
                html += "</ol>";

            }

            html += "</li>";

            return html;
        }

        */
    </script>
}
<div id="page-content">
    <div id='wrap'>
        <div id="page-heading">
            <ol class="breadcrumb">
                <li class='active'><a href="@Url.Content("~/")Despiece/">Despiece</a></li>
                <li class='active'><a href="@Url.Content("~/")Despiece/Index">Index</a></li>
            </ol>

            <h1>Partes</h1>

        </div>
        <div class="container">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <div class="col-sm-10">
                        <h4>Despiece de la Parte: <strong> @ViewBag.Padre.Descripcion</strong></h4>
                    </div>
                    <div class="col-sm-2" style="text-align:right">
                        <input type="button" id="btnInsumo" class="btn btn" value="Convertir en insumo" />
                    </div>
                </div>
                @using (Html.BeginForm("Nuevo", "Despiece", FormMethod.Post, new { @id = "formPrincipal", @class = "form-horizontal" }))
                {
                    @Html.HiddenFor(m => m.IdPartePadre)
                    @Html.HiddenFor(m => m.IdProducto)
                    <div class="panel-body collapse in">
                        <label class="col-sm-1 control-label">Parte</label>
                        <div class="col-sm-3">
                            @Html.TextBoxFor(model => model.Descripcion, new { @class = "form-control autocomplete", @autocomplete = "off" })
                        </div>
                        <label class="col-sm-1 control-label">Cantidad</label>
                        <div class="col-sm-1">
                            @Html.TextBoxFor(model => model.Cantidad, new { @class = "form-control" })
                        </div>
                        <div class="col-sm-6" style="text-align:right">
                            <button id="btnAgregar" class="btn-primary btn">Agregar</button>
                        </div>
                        <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered datatables DTTT_selectable" id="tblPartes">
                            <thead>
                                <tr>
                                    <th width="10%">IdParte</th>
                                    <th width="15%">Codigo</th>
                                    <th width="50%">Descripcion</th>
                                    <th width="10%">Cantidad</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach (var item in ViewBag.Resultado)
                                {
                                    <tr>
                                        <td>@item.Parte.IdParte</td>
                                        <td>@item.Parte.Codigo</td>
                                        <td>@item.Parte.Descripcion</td>
                                        <td>@item.Cantidad</td>
                                    </tr>
                                }
                            </tbody>
                        </table>
                        @Html.HiddenFor(model => model.IdPartePadre)
                        @Html.HiddenFor(model => model.IdParte)
                        @Html.HiddenFor(model => model.IdProducto)
                        <!--end table-->
                    </div>

                                <!-- Modal -->
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                    <h4 class="modal-title">Despiece completo</h4>
                                </div>
                                <div class="modal-body">
                                    <div class="panel-body collapse in">
                                        <div class="cf nestable-lists">
                                            <div id="despiece">
                                                <ul class="dd-list">@DespieceHelper.buildItem(ViewBag.ArbolDeParte)</ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
                                    <button type="button" id="btnGuardarDespiece" class="btn btn-primary">Guardar</button>
                                </div>
                            </div><!-- /.modal-content -->
                        </div><!-- /.modal-dialog -->
                    </div><!-- /.modal -->

                }
                <div class="panel-footer">
                    <div class="row">
                        <div class="pull-right">
                            <div class="btn-toolbar">
                                <button id="btnVolver" class="btn-primary btn">Volver</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


        </div>
        <!-- container -->
    </div>
    <!--wrap -->
</div>
<!-- page-content -->
